<template>
  <div class="wrapper wrapper-content animated fadeInRight v-cloak" v-cloak>
    <div class="row">
      <div class="ibox float-e-margins">
        <div class="form m-tibox-content col-md-12">
          <div class="clearfix "></div>
          <div class="col-md-6">
            <div class="form-group clearfix">
              <label class="control-label">河长类型：</label>
              <div class="col-md-12 form-control" v-html="typeEnum(item.type)">
              </div>
            </div>
            <div class="form-group clearfix">
              <label class="control-label">用户名称：</label>
              <div class="col-md-12 form-control">
                {{ item.name }}
              </div>
            </div>
            <div class="form-group clearfix">
              <label class="control-label">行政区域名称：</label>
              <div class="col-md-12 form-control">
                {{ item.areaName }}
              </div>
            </div>
            <div class="form-group clearfix">
              <label class="control-label">用户性别：</label>
              <div class="col-md-12 form-control">
                {{item.gender==0?'男':'女'}}
              </div>
            </div>
            <div class="form-group clearfix">
              <label class="control-label">河长电话：</label>
              <div class="col-md-12 form-control">
                {{item.cellphone}}
              </div>
            </div>
            <div class="form-group clearfix">
              <label class="control-label">联系单位电话：</label>
              <div class="col-md-12 form-control">
                {{item.unitCellphone}}
              </div>
            </div>
            <div class="form-group clearfix">
              <label class="control-label">河长联系部门：</label>
              <div class="col-md-12 form-control">
                {{item.orgName}}
              </div>
            </div>
          </div>
          <div class="col-md-6">
            <div class="form-group clearfix">
              <label class="control-label">河长单位：</label>
              <div class="col-md-12 form-control">
                {{ item.orgName }}
              </div>
            </div>
            <div class="form-group clearfix">
              <label class="control-label">用户职务：</label>
              <div class="col-md-12 form-control">
                {{ item.job }}
              </div>
            </div>
            <div class="form-group clearfix">
              <label class="control-label">用户账号：</label>
              <div class="col-md-12 form-control">
                {{ item.account }}
              </div>
            </div>
            <div class="form-group clearfix">
              <label class="control-label">登录次数：</label>
              <div class="col-md-12 form-control">
                {{item.count}}
              </div>
            </div>
            <div class="form-group clearfix">
              <label class="control-label">最后登录：</label>
              <div class="col-md-12 form-control">
                {{item.lastLogin | date('yyyy-MM-dd HH:mm:ss')}}
              </div>
            </div>
            <div class="form-group clearfix">
              <label class="control-label">创建时间：</label>
              <div class="col-md-12 form-control">
                {{item.dateCreated | date('yyyy-MM-dd HH:mm:ss')}}
              </div>
            </div>
            <div class="form-group clearfix">
              <label class="control-label">更新时间：</label>
              <div class="col-md-12 form-control">
                {{ item.dateUpdated | date('yyyy-MM-dd HH:mm:ss') }}
              </div>
            </div>
          </div>
          <div class="clearfix "></div>
          <div class="col-md-12">
            <div class="form-group clearfix">
              <label class="control-label">管辖河道：</label>
              <div class="col-md-12 form-control" style="height: auto;">
                {{ item.riverName || '--' }}
              </div>
            </div>
          </div>
          <div class="clearfix "></div>
          <div class="col-12 text-center" style="height: 50px;">
            <div>
              <a @click="lbox.closeMyBoxLayer()" class="btn btn-danger" href="javascript:">返回</a>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script type="text/javascript">
import '@/assets/css/style.css'

import axios from 'axios'
import {site} from '@/assets/js/boss'

export default {
  data() {
    return {
      item: {}
    }
  },
  mounted() {
    let that = window.$vueApp = this;
    document.getElementsByTagName('body')[0].className = 'fixed-sidebar full-height-layout';
    that.staff.init(function () {
      axios.get(site.riverSupervisor.info + sessionStorage.getItem(site.riverSupervisor.info), {}).then(function (response) {
        const result = response.data;
        if (result.code === 0) {
          that.item = result.data;
        } else {
          alert(result.message);
        }
      });
    });
  },
  methods: {
    typeEnum(type) {
      switch (type) {
        case 1:
          return `<span class="label label-info">河长</span>`;
        case 18:
          return `<span class="label label-danger">总河长</span>`;
        case 19:
          return `<span class="label label-warning">副总河长</span>`;
      }
    }
  }
}
</script>
